import QtQuick 2.0
import QtQuick.Controls 1.4
import com.stupidzhe.WeFuckApi 1.0

Item {
    id: root
    anchors.fill: parent
    opacity: 0

    Component.onCompleted: {
        opAnimation.start()
    }
    Component {
        id: contactDelegate
        Rectangle {
            width: parent.width
            height: 70
            border.width: 1
            border.color: "gray"
            color: ListView.isCurrentItem ? "gray" : "#fff" //选中颜色设置

            Row {
                anchors.left: parent.left
                anchors.leftMargin: 10
                anchors.verticalCenter: parent.verticalCenter
                spacing: 10
                Image {
                    width: 45
                    height: 45
                    source: headImgUrl
                }
                Text {
                    text: '' + name + ''
                }
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    listView.currentIndex = index
                    console.log(index)
                }
            }
        }
    }
    Row {
        width: 250
        height: parent.height

        Column {
            anchors.fill: parent
            ListView {
                id: listView
                delegate: contactDelegate
                anchors.horizontalCenter: parent.horizontalCenter
                //                highlightRangeMode: ListView.StrictlyEnforceRange
                width: parent.width
                height: parent.height - 50
                model: listModel
            }

            Button {
                id: fuckBtn
                width: parent.width
                height: 50
                text: "Refresh"
            }
        }
    }
    Connections {
        target: fuckBtn
        onClicked: {
            console.log("try to refresh the frendlist")
            weFuckApi.wantList()
        }
    }

    ListModel {
        id: listModel
        ListElement {
            name: "加载中"
            headImgUrl: ""
        }
    }
    WeFuckApi {
        id: weFuckApi
    }
    property string i: "value"
    Connections {
        target: weFuckApi
        onFrendListChanged: {
            console.log("frendList changed")
            if (listModel.count == 1) {
                listModel.clear()
            }

            for (i in weFuckApi.frendList) {
                listModel.append({
                                     "name": weFuckApi.frendList[i].split(
                                         ";;;")[0],
                                     "userName": weFuckApi.frendList[i].split(
                                         ";;;")[1],
                                     "headImgUrl": weFuckApi.frendList[i].split(
                                         ";;;")[2]
                                 })
            }
        }
    }

    NumberAnimation {
        id: opAnimation
        target: root
        property: "opacity"
        duration: 200
        to: 1
    }
}
